<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link th:href="@{favicon.ico}" rel="shortcut icon"/>
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}"/>
    <link rel="stylesheet" th:href="@{/css/common/main.css}"/>
    <link rel="stylesheet" th:href="@{/css/plugins/font-awesome-4.7.0/css/font-awesome.min.css}" media="all">
    <title>cms-开源社区管理</title>
</head>
<body class="timo-layout-page">
<div class="layui-card">
    <div class="layui-card-header timo-card-header">
        <span><i class="fa fa-bars"></i> 停车费用管理</span>
        <i class="layui-icon layui-icon-refresh refresh-btn"></i>
    </div>
    <div class="layui-card-body">
        <div class="layui-row timo-card-screen put-row">
            <div class="pull-left layui-form-pane timo-search-box">
                <div class="layui-inline">
                    <label class="layui-form-label">停车位编号</label>
                    <div class="layui-input-block">
                        <input type="text" name="parkingName" th:value="${parkingFeeInfo.parkingName}" placeholder="请输入停车位编号"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">年份</label>
                    <div class="layui-input-block">
                        <input type="text" name="year" th:value="${parkingFeeInfo.year==0?'':parkingFeeInfo.year}" placeholder="请输入年份"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">月份</label>
                    <div class="layui-input-block">
                        <input type="text" name="month" th:value="${parkingFeeInfo.month==0?'':parkingFeeInfo.month}" placeholder="请输入月份"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">是否已缴费</label>
                    <div class="layui-input-block">
                        <input type="text" name="whether" th:value="${parkingFeeInfo.whether}" placeholder="是否已缴费"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn timo-search-btn">
                        <i class="fa fa-search"></i>
                    </button>
                </div>
            </div>
            <div class="pull-right screen-btn-group">
                <div class="btn-group-right">
                    <div class="btn-group-right">
                        <button class="layui-btn">
                            <a class="ajax-status-pay" th:href="@{/user/payMultipleParkingFee}" style="color: rgb(255,255,255)">一键缴费</a>
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <div class="timo-table-wrap">
            <table class="layui-table timo-table">
                <thead>
                <tr>
                    <th class="timo-table-checkbox">
                        <label class="timo-checkbox"><input type="checkbox">
                            <i class="layui-icon layui-icon-ok"></i></label>
                    </th>
                    <th data-field="parkingName">停车位编号</th>
                    <th data-field="year">年份</th>
                    <th data-field="month">月份</th>
                    <th data-field="parkingFee">停车费用</th>
                    <th data-field="whether">是否已缴费</th>
                    <th data-field="feeDate">缴费日期</th>
                    <th data-field="peoName">缴费人</th>
                    <th data-field="odd">缴费单号</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr th:each="item:${parkingFeeInfoList}">
                    <td>
                        <label class="timo-checkbox">
                            <input type="checkbox" th:value="${item.id}">
                            <i class="layui-icon layui-icon-ok"></i></label>
                    </td>
                    <td th:text="${item.parkingName}">停车位编号</td>
                    <td th:text="${item.year}">年份</td>
                    <td th:text="${item.month}">月份</td>
                    <td th:text="${item.parkingFee}">物业费用</td>
                    <td th:text="${item.whether}">是否已缴费</td>
                    <td th:text="${item.feeDate}">缴费日期</td>
                    <td th:text="${item.peoName}">缴费人</td>
                    <td th:text="${item.odd}">缴费单号</td>
                    <td>
                        <a class="ajax-get" th:attr="data-msg='您是否缴费'"
                           th:href="@{'/user/payParkingFee/'+${item.id}}">缴费</a>
                        <a class="open-popup" data-title="详细信息" th:attr="data-url=@{'/admin/parkingFee/detailParkingFee/'+${item.id}}"
                           data-size="800,400" href="#">详细</a>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="layui-row">
            <div class="layui-col-sm6">
                <div class="page-info">
                    <span>显示 [[${pageInfo.startRow}]]/[[${pageInfo.endRow}]] 条，共 [[${pageInfo.total}]] 条记录</span>
                </div>
            </div>
            <div class="layui-col-sm6">
                <ul class="pagination list-page">
                    <li class="page-item"><a class="page-link">上一页</a></li>
                    <li th:class="${num == pageInfo.pageNum} ? 'page-item active' : 'page-item'"
                        th:each="num:${pageInfo.navigatepageNums}">
                        <a class="page-link breviary" th:text="${num}" th:attr="page=${num}"></a>
                    </li>
                    <li class="page-item"><a class="page-link">下一页</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
    <script th:src="@{/layui/layui.js}"></script>
    <script th:src="@{/js/plugins/layer/layer.min.js}"></script>
    <script th:src="@{/js/common/main.js}"></script>
    <script th:src="@{/js/plugins/jquery.min.js}"></script>
    <script>
    $(".page-link").on("click", function (e){
        let getSearch = "";
        // 搜索框参数
        $('.timo-search-box [name]').each(function (key, val) {
            if ($(val).val() !== "" && $(val).val() !== undefined) {
                getSearch += $(val).attr("name") + "=" + $(val).val() + "&";
            }
        });
        if($(this).text()==='上一页'){
            if ([[${pageInfo.pageNum}]]===1){
                // console.log("点击了上一页无效")
            }else {
                getSearch += "pageNum=" + (Number($(".active").children().text())-1) + "&";
                if (getSearch !== "") {
                    getSearch = "?" + getSearch.substr(0, getSearch.length - 1);
                }
                //console.log(window.location.pathname + getSearch);
                window.location.href = window.location.pathname + getSearch;
            }
        }
        else if($(this).text()==='下一页'){
            if ([[${pageInfo.pageNum}]]===[[${pageInfo.pages}]]){
                //console.log("点击了下一页无效")
            }else {
                getSearch += "pageNum=" +(Number($(".active").children().text())+1) + "&";
                if (getSearch !== "") {
                    getSearch = "?" + getSearch.substr(0, getSearch.length - 1);
                }
                //console.log(window.location.pathname + getSearch);
                window.location.href = window.location.pathname + getSearch;
            }
        }else {
            getSearch += "pageNum=" + $(this).text() + "&";
            if (getSearch !== "") {
                getSearch = "?" + getSearch.substr(0, getSearch.length - 1);
            }
            //console.log(window.location.pathname + getSearch)
            window.location.href = window.location.pathname + getSearch;
        }
    })
</script>
</body>
</html>